<%@page import="com.fishing.util.DateUtil"%>
<%@page import="java.text.SimpleDateFormat"%>
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!doctype html>
<html>
<head>
<title>发邮件</title>
<base href="<%=basePath%>" />
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="renderer" content="webkit">
<meta http-equiv="Cache-Control" content="no-siteapp" />
<link rel="icon" type="image/png" href="i/buyu.ico">
<link rel="apple-touch-icon-precomposed" href="i/app-icon72x72@2x.png">
<meta name="apple-mobile-web-app-title" content="Amaze UI" />
<link rel="stylesheet"
	href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" />
<link rel="stylesheet" href="css/amazeui.min.css" />
<link rel="stylesheet" href="css/admin.css">
<link rel="stylesheet" href="css/app.css">
<style type="text/css">
.waterTable tr td {
	background: #f3f4f6;
}

.am-form-group {
	margin-bottom: 0px;
}

.am-list-border>li>a, .am-list-bordered>li>a {
	padding: 2rem;
}

</style>
</head>
<%
	String today = new SimpleDateFormat("yyyy-MM-dd").format(new Date());
%>
<body>

	<div class="tpl-page-container tpl-page-header-fixed">

		<div
			class="tpl-portlet-components tpl-portlet-components-percent am-center">
			<div class="portlet-title">
				<div class="caption bold">
					<span>发邮件</span>
				</div>
			</div>
			<div class="tpl-block">

				<div class="am-g">
					<div class="am-u-sm-12">

						<form class="am-form am-form-horizontal formEditor"
							datasource="email/add" nextStep="reset" id="sendEmail"
							onsubmit='return toEmail()'>
							<div class="am-form-group">
								<div class="am-u-sm-12">
									<label for="user-intro" class="am-form-label">标题</label>
									<div class="am-form-group">
										<input type="text" id="title" name="title" validates="{required:true,message:{required:'不能为空！'}}" autocomplete="off">
									</div>
								</div>
							</div>
							<!-- 选择全部发送,还是指定玩家 https://www.jianshu.com/p/357ac299481b-->
							<div class="am-form-group">
								<div class="am-u-sm-12">
									<label for="user-intro" class="am-form-label">玩家(指定玩家或者全部玩家)</label>
									<input style="border: 1px, solid green" name="userid" style="border:1px solid #c8cccf;"
									placeholder="输入全部玩家/指定账号"	id="userID" autocomplete="off">
									<datalist list="userID" style="border:1px solid #c8cccf;">
										<option>全部玩家</option>
									</datalist>
								</div>
							</div>

							<div class="am-form-group" id="timeDiv">
								<div class="am-u-sm-12">
									<label for="user-intro" class="am-form-label">邮件到期时间</label> <select
										name="timeDiv">
										<option value="2">2天</option>
									</select>
								</div>
							</div>

							<div class="am-form-group">
								<div class="am-u-sm-12">
									<label class="am-form-label">附件(<span style="color:red;">道具所送种类上限为10</span>)<input
										type="checkbox" name="haveAttach" id="haveAttach"></label>
									<div class="am-form-group" id="attachDiv"
										style="display: none;">
										<span style="float: left;">金币</span><input type="number"
											class="am-input-sm" name="Gold" id="Gold" value="0"
											style="float: left; width: 100px;" min="0">
								        <span style="float: left;">钻石</span><input type="number"
											class="am-input-sm" name="Diamond" id="Diamond" value="0"
											style="float: left; width: 100px;" min="0"> 
										<span style="float: left;">锁定</span><input type="number"
											class="am-input-sm" name="locking" id="Locking" value="0"
											style="float: left; width: 100px;" min="0"> 
										<span style="float: left;">冰冻</span><input type="number"
											class="am-input-sm" name="Frozen" id="Frozen" value="0"
											style="float: left; width: 100px;" min="0"> 
										<span style="float: left;">召唤葫芦</span><input type="number"
											class="am-input-sm" name="SummonGourd" id="SummonGrourd"
											value="0" style="float: left; width: 100px;" min="0"> 
										<span style="float: left;">狂暴卡</span><input type="number"
											class="am-input-sm" name="ViolentCard" id="ViolentCard"
											value="0" style="float: left; width: 100px;" min="0"> 
										<span style="float: left;">分身卡</span><input type="number"
											class="am-input-sm" name="SplitCard" id="SplitCard" value="0"
											style="float: left; width: 100px;" min="0"> 
										<span style="float: left;">防水木料</span><input type="number"
											class="am-input-sm" name="WaterproofWood" id="WaterproofWood"
											value="0" style="float: left; width: 100px;" min="0"> 
										<span style="float: left;">精炼矿石</span><input type="number"
											class="am-input-sm" name="RefinedOre" id="RefinedOre"
											value="0" style="float: left; width: 100px;" min="0">
										<span style="float: left;">海妖外壳</span><input type="number" 
										    class="am-input-sm" name="SirenShell" id="SirenShell"
										    value="0" style="float: left; width: 100px;" min="0">
										<span style="float: left;">潮汐精粹</span><input type="number"
											class="am-input-sm" name="TidalQuintessence" id="TidalQuintessence" 
											value="0" style="float: left; width: 100px;" min="0"> 
										<span style="float: left;">深海魔精</span><input type="number"
											class="am-input-sm" name="DeepSeaMagic" id="DeepSeaMagic"
											value="0" style="float: left; width: 100px;" min="0">
										<span style="float: left;">倍击</span><input type="number"
											class="am-input-sm" name="Doublehit" id="Doublehit"
											value="0" style="float: left; width: 100px;" min="0">
										<span style="float: left;">锤子碎片</span><input type="number"
											class="am-input-sm" name="Hammerfragment" id="Hammerfragment"
											value="0" style="float: left; width: 100px;" min="0">
										<span style="float: left;">青铜弹头</span><input type="number"
											class="am-input-sm" name="BronzeWarhead" id="BronzeWarhead"
											value="0" style="float: left; width: 100px;" min="0">
										<span style="float: left;">白银弹头</span><input type="number"
											class="am-input-sm" name="SilverWarhead" id="SilverWarhead"
											value="0" style="float: left; width: 100px;" min="0">
										<span style="float: left;">黄金弹头</span><input type="number"
											class="am-input-sm" name="GoldWarhead" id="GoldWarhead"
											value="0" style="float: left; width: 100px;" min="0">
										<span style="float: left;">紫金弹头</span><input type="number"
											class="am-input-sm" name="PlatinumWarhead" id="PlatinumWarhead"
											value="0" style="float: left; width: 100px;" min="0">
									</div>
								</div>
							</div>

							<div class="am-form-group">
								<div class="am-u-sm-12">
									<label for="user-intro" class="am-form-label">邮件内容
									</label>

									<textarea name="content" id="content" rows="8"
										placeholder="邮件内容最大支持120个字符，不支持繁体中文,$ &等特殊字符，会自动过滤空格和换行符"></textarea>
									<small>邮件内容最大支持120个字符，不支持繁体中文,$ &等特殊字符，会自动过滤空格和换行符</small>
								</div>
							</div>

							<div class="am-form-group">
								<div class="am-u-sm-12">
									<button type="submit" class="am-btn am-btn-primary">发送</button>
									<button type="reset" class="am-btn am-btn-default">重置</button>
								</div>
							</div>
						</form>

					</div>

				</div>
			</div>
	


	<script src="js/jquery.min.js"></script>
	<script src="js/amazeui.min.js"></script>
	<script src="js/app.js"></script>
	<script src="js/layer${applicationScope.skin}/layer.js"></script>
	<script src="js/frame/form_upload.js"></script>
	<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
	<script src="js/bootstrap-suggest/bootstrap-suggest.min.js"></script>
	<script src="js/personal/formsubmit.js"></script>
    <script src="layui/layui.all.js"></script>
	<script type="text/javascript">
		$(function() {
           var $stime = $('#stime');
    	   var $etime = $('#etime');
    	   var $endTime = $('#endTime');
    	   $stime.datepicker();
    	   $etime.datepicker();
    	   $endTime.datepicker();
			$(":checkbox[name='haveAttach']").click(function() {
				var prop = $(this).prop("checked");
				if (prop) {
					$("#attachDiv").show();
				} else {
					$("#attachDiv").hide();
				}
			});

$(":checkbox[name='haveCard']").click(function(){
    		var prop = $(this).prop("checked");
    		if(prop){
    			$("#cardDiv").show();
    		}else{
    			$("#cardDiv").hide();
    		}
    	});
			$(":radio[name='cardType']").click(function() {
				var content = $("#content").val();
				if (content.indexOf("{money}") != -1) {
					var val = $(":radio[name='cardType']:checked").val();
					if (val == 1) {
						content = content.replace('{money}', 50);
					} else {
						content = content.replace('{money}', 100);
					}
				}
				$("#content").val(content);
			});


			var mbLayerIndex = null;

			$("#mbUl li").click(function() {
			        var text = $(this).find("a").text();
				if (text.indexOf("{money}") != -1&& $(":checkbox[name='haveCard']").prop("checked")) {
							var cardType = $(":radio[name='cardType']:checked").val();
							var cardMoney = 50;
							if (cardType == 2) {
								cardMoney = 100;
							}
							text = text.replace('{money}', cardMoney);
						}
						$("#content").val(text);
						if (null != mbLayerIndex) {
							layer.close(mbLayerIndex);
						}
					});

	var testBsSuggest = $("#testNoBtn").bsSuggest({
				url : "pa/loadAll?keywords=",
				showBtn : false,
				idField : "userId",
				keyField : "showId",
				allowNoKeyword:false,
				getDataMethod: 'url',
				delayUntilKeyup: true, 
				effectiveFields: ['showId','nickname','username'], 
				effectiveFieldsAlias: {'showId':'游戏ID','nickname':'昵称','username':'账号'}, 
				searchFields: ['showId','nickname'], 
			}).on("onDataRequestSuccess", function(e, result) {
				console.log("onDataRequestSuccess: ", result)
			}).on("onSetSelectValue", function(e, keyword) {
				console.log("onSetSelectValue: ", keyword)
				$("#userId").val(keyword.id);
			}).on("onUnsetSelectValue", function(e) {
				console.log("onUnsetSelectValue")
				$("#userId").val("");
		});
	});	
		
	</script>
</body>

</html>